<template>
	<view >

    <navbar fixed leftIcon="left" :title="symbol +' 交易记录'" shadow></navbar>
    <view class="bg-fff">
      
      <view class="width100 h57 view flex-row align-center" v-if="defaultIndex == 0">
          <view class="fz-12 c_3c3 flex-1 view  align-center">接受地址</view>
		  <view class="fz-12 c_3c3 flex-1 view  align-center">时间</view>
		  <view class="fz-12 c_3c3 flex-1 view  align-center">数量</view>
      </view>
      <view v-if="list.length > 0" class="list autoH m-t-10" @touchstart="touchstart" @touchmove="touchmove" @touchend="touchend">
          <sib-list :scrollHeight="getScrollH()" ref="sibList" @isRefresh='isRefresh' @scrolltolowerFn="scrolltolowerFn">
              <block slot="sibScrollList">
                <view v-if="defaultIndex == 0">
					<view class="view transfer-line align-center justify-center h50 b-b-1 p-b-10 m-b-10" v-for="(item,index) in list" :key="index">
                      <view @click="copyText(item.to)" class="transfer-item f1 align-center justify-center">
						<view class="c_3c3 fz-10">{{item.to | toHide}}</view>
                      </view>
					  <view class="transfer-item f1 view align-center justify-center">
						<view class="c-c4 fz-10">{{item.timeStr}}</view>
					  </view>
                      <view class="transfer-item f1 view align-center justify-center">
                        <view class="c_3c3 fz-12">{{ item.realNum }}</view>
                      </view>
                      <view @click="copyText(item.hash)" class="transfer-item f3 view align-center justify-center">
                        <view class="c_3c3 fz-12">{{item.hash | hashHide}}</view>
                      </view>
					  <view class="tfransfer-item f1 view align-center justify-center">
					    <view class="c_3c3 fz-10">类型：{{transferInOut(item.to)}}</view>
					  </view>
                  </view>
                </view>
              </block>
          </sib-list>
      </view>
      <noData :custom="true" v-if=" list.length == 0">
        <view class="c_fff fz-12 c_3c3">暂无数据</view>
      </noData>
      
    </view>
     
	</view>
</template>

<script>
  import liuyunoTabs from '@/components/liuyuno-tabs/liuyuno-tabs.vue'
  import navbar from '@/components/uni-nav-bar'
  import noData from '@/components/noData/noData'
  import sibList from '@/components/sib-list/sib-list.vue'
  import { mapMutations, mapState } from 'vuex'
  import {getTokenHistoryErc} from '@/apis/bsc20.js'
  
	export default {
    components: {
      noData,
      sibList,
      navbar,
      liuyunoTabs
		},
		data() {
			return {
        tabs: ['交易记录','内部转账','外部转账'],
		basic_id: 1,
        defaultIndex: 0,
        type: 1,
        active: 0,
        list: [	],
        page: 1,
        rows: 10,
        total: 0,
		symbol: '',
        more: 'more',
        items: [
          {name: '已完成', key: 0},
          {name: '已作废' , key: 1}
        ],
        showSelect: false
			}
    },
    filters:{
		textStatus(value){
			switch(value){
				case 1: 
					return '参与中';break;
				case 2:
					return '已结算';break;
				case 3:
					return '爆仓';break;
				case 4:
					return '已爆仓';break;
			}
			return ''
		},
		earnStatus(value){
			switch(value){
				case 1: 
					return '出仓数额';break;
			}
			return '爆仓返还'
			//1奖励 2直退 3间推 4社区奖励 5持单收益 6运营管理 7分红 21过期LV1，22过期LV2，23过期LV3依次加）
		},
		toHide(value){
			if(!value){
				return ''
			}
			return value.substr(0,5) + "...." + value.substr(value.length - 5)
		},
		hashHide(value){
			if(!value){
				return ''
			}
			return 'HASH: ' + value.substr(0,10) + "...." + value.substr(value.length - 10)
		},
		mobileNumber(number){
			if(!number){
				return '未绑定手机'
			}
			return number.substr(0,3) + "****" + number.substr(7)
		},
		transferNum(item){
			if(item){
				return item.value / (10 ** item.tokenDecimal-1);
			}
			return 0;
		}
	},
	computed: {
		...mapState(['defaultWallet']),
	},
    mounted() {
      this.getList(true)
    },
	onLoad (opt) {
		console.log('address',this.defaultWallet.address);
		this.symbol = opt?.symbol ?? 'DYS';
	},
	methods: {
      formaJson(item) {
        return JSON.pase(item)
      },
      hideSelect() {
        this.$refs.selector.bodyCloseMenus()
      },
			touchstart: function(e) {
				this.$refs.sibList.refreshStart(e);
			},
			touchmove: function(e) {
				this.$refs.sibList.refreshMove(e);
			},
			touchend: function(e) {
				this.$refs.sibList.refreshEnd(e);
      },
      getScrollH() {
        return uni.getSystemInfoSync() - 50 + 'px'
      },
			isRefresh: function() {
        const _this = this
				setTimeout(() => {
					uni.showToast({
						icon: 'success',
						title: '刷新成功'
					})
					// const defaultData = [
					// 	'初始数据1', '初始数据2', '初始数据3', '初始数据4',
					// 	'初始数据5', '初始数据6'
					// ]
          // _this.list = defaultData
          this.getList(true, () => {
            this.$refs.sibList.endAfter()
          })
					// 刷新结束调用
				}, 1000)
			},
			scrolltolowerFn: function() {
        if (this.list.length == this.total) {
          return false
        }
				uni.showLoading({
					title: '加载中...',
					mask: true
				})
				// 模拟请求
				const _this = this
				setTimeout(() => {
					// 请求成功
					this.getList(null, () => {
            uni.hideLoading()
          })
					
				}, 1000)
			},
      changeIndex(i) {
        this.defaultIndex = i
        if (i == 0) {
          this.type = 1
        } else if (i == 1) {
          this.type = 2
        } else{
		  this.type = 3
		}
        this.getList(true)
      },
      async getList(isReflush, cb) {
		uni.showLoading({
		  	title: '加载中...',
		  	mask: true
		})
        if (isReflush) {
          this.page = 1
        } else {
          this.page++
        }
		let res
		res = await getTokenHistoryErc(this.symbol);
		uni.hideLoading()
		console.log('历史记录',res)
		this.total = res.data.length;
		this.list = res.data;
        /*if (this.page == 1) {
          this.total = res.data.total
          this.list = res.data.list
        } else {
          this.list = [...this.list, ...res.data.list]
        }*/
        cb && cb()
      },
	  onNavigationBarButtonTap(e) {
          if (e.index == 0) {
            this.showSelect = true
          }       
      },
	  copyText(word){
	  	uni.setClipboardData({
	  	    data: word,
	  	    success: function () {
	  	      uni.showToast({
	  	        title: '复制成功!',
	  	        icon: 'none'
	  	      })
	  	    }
	  	});
	  },
	  transferInOut(address){
	  	if(address){
	  		if(address == this.defaultWallet.address){
	  			return '转入'
	  		}
	  		return '转出'
	  	}
	  	return '合约'
	  }
		}
	}
</script>

<style lang="scss" scoped>
page {
    background-color:#f5f5f5;
    box-sizing: border-box;
    overflow-y: hidden;
		
  }
.bo {
  border:2px solid #343438;
}
.show-detail {
  border-radius: 60rpx;
}
/deep/.auto-h {
  height: calc(100vh - 220rpx) !important;
}
.autoH {height: calc(100vh - 430rpx);}
.bor-line {
  width: 100%;
  background: linear-gradient(90deg, rgba(255, 255, 255, 0) 0%, #FFFFFF 50%, rgba(255, 255, 255, 0) 100%);
  opacity: 0.3;
  height: 1px;
}
/deep/.auto-h {height:calc(100vh - 90rpx)!important; }
 .bgs {
   background-position: center;
   background-size: cover;
   background-repeat: no-repeat;
 }
 .b-b-1 {border-bottom: 1px solid #eee;}
 .transfer-line{
	display: flex;
	flex-wrap: wrap;
	flex-direction: row;
	.f1{
		flex: 1 0 25%;
		//flex:1;
	}
	.f2{
		flex: 1 0 50%;
		//flex:2;
	}
	.f3{
		flex: 1 0 45%;
		//flex:3;
	}
	.f4{
		flex: 1 0 100%;
		//flex:4;
	}
 }
 .transfer-item{
	display: flex;
	flex-direction: row;
 }
</style>